@import '../../../style/DesignerStyle.less';


.list-search {
  padding: 5px;

  input {
    background-color: #363636;
    transition: background-color 0.5s;
  }

  input:hover {
    background-color: #2a2a2a;
    transition-duration: 0.3s;
  }

  input::placeholder {
    color: #818181;
    transition-duration: 0.3s;
  }
}

.list-items {
  padding: 0 5px;
  overflow-y: auto;
  height: calc(100% - 39px);


  .list-item {
    width: 100%;
    height: 120px;
    cursor: pointer;
    margin-bottom: 10px;
    background-color: #363636;

    .item-header {
      height: 25px;
      line-height: 25px;
      background-color: #363636;
      display: flex;
      justify-content: space-between;
      padding: 0 5px;
      color: #8d8d8d;
      font-size: 10px;
    }

    .item-content {
      box-sizing: content-box;
      padding: 5px 10px 10px 10px;

      img {
        width: 100%;
      }
    }
  }
}


@keyframes lcFadeInUp1 {
  0% {
    opacity: 0;
    transform: translateX(20px);
  }
  50% {
    opacity: 1;
    transform: translateX(20px);
  }
  55% {
    opacity: 1;
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }

}